<!doctype html>
<html>

	<head>
		<meta name="keywords" content="甜爱，SweetLove,甜品，甜点，生日蛋糕，冰淇淋，冰品" />
		<meta name="description" content="甜爱网上商城是专注于甜品销售、进口的网站，各种甜品、甜点齐全，还有解暑的各种冰品任顾客挑选，让他们感受到爱的温馨。">
		<meta charset="utf-8">
		<title>请登录</title>
		<link rel="shortcut icon" href="images/logo_01.png">
		<link rel="stylesheet" href="css/复制login.css">
		<link rel="shortcut icon" href="favicon.ico">
		<link rel="stylesheet" href="css/iconfont.css">
		<link rel="stylesheet" href="css/global.css">
		<link rel="stylesheet" href="css/bootstrap.min.css">
		<link rel="stylesheet" href="css/bootstrap-theme.min.css">
		<link rel="stylesheet" href="css/swiper.min.css">
		<link rel="stylesheet" href="css/styles.css">
		<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.css">
		
	</head>

	<style type="text/css">
		.cu {
			cursor: pointer;
		}
	</style>

	<body>
		<div id="dingdan"></div>
		<!--页头-->
		<div id="headCon">
			<div>
				
			</div>
			<ul>
				<a href="index.html">
					<li></li>
				</a>
				<span></span>
				<p>请登录</p>
			</ul>
		</div>
		<!--内容-->
		<div id="contentCon">
			<div>
				<ul>
					<li>
						<p class="cu" id="ptlogin" onclick="pt()">普通登录</p>
						<span class="cu" id="tellogin" onclick="ptz()">快捷登录</span>
					</li>

					<span id="cg">
						<form id="cgg" >
							<span id="erro" style="display:inline-block ;border: 1px solid red;margin-left: 37px;visibility: hidden;background-color: #ffebeb;text-align: center;margin-top: 10px;color: red;width: 310px;">账号或者密码有错误</span>
							<input type="text" name="name" placeholder="用户名/邮箱/手机号" class="name" onfocus="upbrcl(this),this.placeholder='用户名/邮箱/手机号'">
							
						    <input type="password" name="pawd" placeholder="请输入密码" class="password" onfocus="upbrcl(this),this.placeholder='请输入密码'" >
						</form>
						
					</span>
					<span id="kj" style="display: none;">
						<form id="kjj"  >
						<span id="erroz" style="display:inline-block ;visibility: hidden;border: 1px solid red;margin-left: 37px;background-color: #ffebeb;text-align: center;margin-top: 5px;color: red;width: 310px;">验证码错误</span>
						<input type="text" id="tel" name="tel" placeholder="请输入手机号" class="name" maxlength="11" onfocus="upbrcl(this),this.placeholder='请输入手机号'"   oninput = "value=value.replace(/\D+/,'')" style="margin-top: 5px;"/>
						<input type="text" id="code" name="code" placeholder="验证码" id="code" onfocus="upbrcl(this),this.placeholder='验证码'" oninput = "value=value.replace(/\D+/,'')" maxlength="6"/>
						<button id="yzm" onclick="hqcode()">获取验证码<span id="djs"></span></button>
					</form>
					</span>
					<a id="ajx_login" style="text-decoration: none;" >登录</a>
					<div>
						<a href="forgetpwd.html">忘记密码？</a>
						<a href="register.html" class="text02">去注册</a>
					</div>
					<ol>
						<span></span>
						<p>其他登录方式</p>
						<i></i>
					</ol>

				
				</ul>
			</div>
		</div>
		<!--页脚-->
         <div id="dibu"></div>
					
	</body>
	<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
	<script>
		//获取验证
		function hqcode() {
			var yzm = document.getElementById("yzm");
			yzm.disabled = true;
			var i = 60;
			var z = setInterval(function() {
				document.getElementById("djs").innerHTML = "(" + i + ")";
				if(i == 0) {
					yzm.disabled = false;
					clearTimeout(z);
					document.getElementById("djs").innerHTML = "";
				}
				i -= 1;
			}, 1000);
				//调用后台发送短信
			$.ajax({
				url: 'http://localhost:16111/user/g_send_dx',
				type: 'post',
				dataType: 'text',
				data: {
					tel: $("#tel").val().trim()
				},
				success: function(data) {
					console.log("短信获取成功")
				}
			});
		} 
		//样式
		var ptlogin = document.getElementById("ptlogin");
		//隐藏盒子
		var cg = document.getElementById("cg");

		var tellogin = document.getElementById("tellogin")
		var kj = document.getElementById("kj");
        //普通
		function pt() {
			kj.style.display = "none";
			tellogin.style.borderBottom = "0px";

			cg.style.display = "inline";
			ptlogin.style.borderBottom = "2px solid black";

		}
         //快捷
		function ptz() {
			cg.style.display = "none";
			ptlogin.style.borderBottom = "0px";

			kj.style.display = "inline";
			tellogin.style.borderBottom = "2px solid black";

		}
	</script>
	<script type="text/javascript">
				
				//顶端导入
		$("#dingdan").load("index_head.html");
	   $("#dibu").load("底部页面.html");
				
		        
       function upbrcl(z){
       	    document.getElementById("erro").style.visibility = "hidden";
       	    $("#erroz").css("visibility","hidden");
        	z.style.borderColor = "#d2d2d2";
        }
		//登录
		$("#ajx_login").click(function() {
			var z = "#cgg"
			var name = document.getElementsByClassName("name");
			var pswd = document.getElementsByClassName("password");
			var code = document.getElementById("code");
			if((document.getElementById("kj").style.display) + "" == "inline") {
				z = "#kjj";
			}
			if(z == "#cgg") {
              if(name[0].value.trim()==""){
              	  name[0].style.borderColor = "red";
              	  name[0].placeholder = "账号为空 请填写账号";
              }else if(pswd[0].value.trim()==""){
                  pswd[0].style.borderColor = "red";
                  pswd[0].placeholder = "密码为空 请填写密码";
              }else{ 	
              	x();
              }
			}else{
				
			  if(name[1].value.trim()==""){
              	name[1].style.borderColor = "red";
              	name[1].placeholder = "手机号为空 请填写账号";
              }else if(name[1].value.length != 11){
              	name[1].value = "";
              	name[1].style.borderColor = "red";
              	name[1].placeholder = "手机号格式不对";
              }else if(code.value==""){
              	code.style.borderColor = "red";
              	code.placeholder = "验证码不能为空"
              }else{
              	y();
              }
			}
            // 密码登录
			function x() {
				
                 	$.ajax({
					url: 'http://localhost:16111/user/g_login',
					type: 'get',
					dataType: 'json',
					xhrFields:{withCredentials: true},
					data: $("#cgg").serialize(),
					success: function(data) {
						if(data.code==1){
							location.href = "index.html";
							//sessionStorage.setItem("userid",data.data);
						}else{
							document.getElementById("erro").style.visibility = "visible";
						}
					}
				});
			};
			// 快捷手机登录
			function y() {
				$.ajax({
					url: 'http://localhost:16111/user/g_tel',
					type: 'post',
					dataType: 'json',
					data: $("#kjj").serialize(),
					success: function(data) {
						if(data.code==1){
							location.href = "index.html";
							//sessionStorage.setItem("userid",data.data)
						}else if(data.code == -1){
							$("#erroz").empty();
							$("#erroz").append("验证码错误")
							document.getElementById("erroz").style.visibility = "visible";
							
						}else{
							$("#erroz").empty();
							$("#erroz").append("手机没有注册免费注册")
							document.getElementById("erroz").style.visibility = "visible";
						}
					}
				});
			};
		});
		
	</script>

</html>